<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>eBarrio</title>
        <script src="<?php echo base_url(); ?>js/jquery-1.7.1.min.js"></script>
        <script src="<?php echo base_url(); ?>js/jquery-ui-1.8.18.custom.min.js"></script>

        <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
        <script src="<?php echo base_url(); ?>/js/ui_maps/jquery.ui.map.full.min.js" type="text/javascript"></script>
        
        <link rel="stylesheet" href="<?php echo base_url(); ?>css/ui/jquery-ui-1.8.18.custom.css">
        <link rel="stylesheet" href="<?php echo base_url(); ?>css/ui/themes/ui-lightness/jquery-ui-1.8.16.custom.css">
        <link rel="stylesheet" href="<?php echo base_url(); ?>css/ebarrio.css">

        <?php
        require_once('/recaptcha/recaptchalib.php');
        $captcha_publickey = $publickey;
        $error_captcha = null;
        ?>

    </head>
    <body id="ebarrio_user">
        <div id="cabecera">
            <div id="opciones">
                <div class="left"></div>
                <ul> <li>
                        <?php
                        echo '<a class="menu" id="mapa" title="Mapa" href="#">Mapa</a>';
                        ?>
                        <br>
                        <img id="mapa_cerrar" class="cerrar_desactivado" src="<?php echo base_url(); ?>/img/icon_close.png">
                    </li>
                    <li>
                        <?php
                        echo '<a class="menu" id="logarse" title="Login" href="' . $enlace . '">' . $username . '</a>';
                        ?>
                    </li>
                    <li>
                        <?php
                        echo '<a class="menu" id="registro" title="Registro" href="' . $registro . '">Registrar</a>';
                        ?>
                    </li>
                </ul>
                <div class="right"></div>
            </div>
        </div>
        <script type="text/javascript">
		$(document).ready(function() {

			// Eventos del menu
			
			$('#mapa_cerrar').click(function(e){
				e.preventDefault();
				$( "#mapa_google" ).dialog( "close" );
			});
			
			// Fin Eventos del menu
			
								
                /*
//Si se selecciona se mantiene seleccionado hasta que se pulse otro elemento del menu
                $("li a").click(function(e){
                    e.preventDefault();
                    $(".selected").removeClass("selected");
                    $(this).addClass("selected");
                });
                 */
                
                $('#opciones ul li a').each(function() {

                    var pagina = $(this).attr("href");
                    var identificador = $(this).attr("id");
                    if (identificador == 'registro') {
// REGISTRARSE
                      var email = $( "#dialog-form #email" ),
                          cod_postal = $( "#dialog-form #cod_postal" ),
                          password1 = $( "#dialog-form #password1" ),
                          password2 = $( "#dialog-form #password2" );
                          allFields = $( [] ).add(email).add(cod_postal).add(password1).add(password2);

//                    var $dialog = $('<div></div>');
                        var $dialog_registro =$( "#dialog-form" )
//                        var $link = $(this).one('click', function(e) {
                        var $link = $(this).click(function(e) {
                            e.preventDefault();
                            $dialog_registro
                            .dialog({
                                title: $link.attr('title'),
                                width: 350,
                                height: 510,
                                modal: false,
                                buttons: {
                                    "Registrarse": function() {
                                            
                                        $( "#cargando" ).dialog( "open" );

                                        var objajax = $.post("<?php echo site_url(); ?>ebarrio/registrar", { email: email.val(),
                                                                                                             cod_postal: cod_postal.val(),
                                                                                                             password1: password1.val(),
                                                                                                             password2: password2.val()
                                                                                                            });

                                        $( "#cargando" ).dialog( "close" );

                                        objajax.error(function(){
                                            $( "#error" ).dialog( "open" );
                                        });

                                        objajax.success(function(respuesta,textostatus){
                                            $( "#cargando" ).dialog( "close" );
                                            
                                            switch (respuesta) {
                                                case "0":
                                                    $( "#dialog-form" ).dialog( "close" );
                                                    $( "#aviso-correcto" ).dialog( "open" );
                                                    break

                                                default:
                                                    $( "#error" ).dialog( "open" );
                                            }
                                        });
                                    },
                                    Cancel: function() {
                                        $( this ).dialog( "close" );
                                        Recaptcha.reload();
                                    }
                                },
                                close: function() {
                                    //				allFields.val( "" ).removeClass( "ui-state-error" );
                                    allFields.val( "" );
                                    Recaptcha.reload();
                                }
                            });

                            //$(".selected").removeClass("selected");
                        
 
                            $link.click(function() {
                                $dialog_registro.dialog('moveToTop');
                            });

                            return false;
                        });

                    }else if(identificador == 'logarse'){
//ENTRAR - LOGARSE
                        var email = $( "#login #email" ),
                            password = $( "#login #password" ),
                            allFields = $( [] ).add( email ).add( password );

                        var $dialog_login =$( "#login" )
                        var $link = $(this).click(function(e) {
                            e.preventDefault();
                            $dialog_login
                            .dialog({
                                title: $link.attr('title'),
                                width: 350,
                                //height: 600,
                                modal: false,
                                buttons: {
                                     "Entrar": function() {
                                            //recordar = $( "#login #recordar" );
                                        if($("#login #recordar").is(':checked')) {
                                            recordar = 1;
                                        }else{
                                            recordar = 0;
                                        }
                                        $( "#cargando" ).dialog( "open" );
                                        var objajax = $.post("<?php echo site_url(); ?>ebarrio/login", { email: email.val(),
                                                                                                             password: password.val(),
                                                                                                             recordar: recordar
                                                                                                            });
                                        $( "#cargando" ).dialog( "close" );
                                        objajax.error(function(){
                                            $( "#error" ).dialog( "open" );
                                        });
                                        objajax.success(function(respuesta,textostatus){
                                            $( "#cargando" ).dialog( "close" );
                                            
                                            switch (respuesta) {
                                                case "0":
                                                    $( "#logarse" ).text('Eugenio');
                                                    $( "#login" ).dialog( "close" );
                                                    $( "#aviso-correcto" ).dialog( "open" );
                                                    break

                                                default:
                                                    $( "#error" ).dialog( "open" );
                                            }
                                        });
                                     }, // Fin boton Entrar
                                    Cancel: function() {
                                        $( this ).dialog( "close" );
                                        Recaptcha.reload();
                                    }
                                },
                                    close: function() {
                                    allFields.val( "" );
                                }
                            }).height("auto");
                            
                            $link.click(function() {
                                $dialog_login.dialog('moveToTop');
                            });
                            return false;
                        });
                    }else if(identificador == 'mapa'){
// mapa

						var mapa_cerrar = $('#mapa_cerrar');
                        var $dialog_mapa = $( "#mapa_google" );
//                        var $link = $(this).one('click', function(e) {
                        var $link = $(this).click(function(e) {
                            e.preventDefault();
                            
                            	$dialog_mapa
                            	.dialog({
                                	title: $link.attr('title'),
                                	width: 350,
                                	height: 510,
                                	modal: false,
                                	resizable: false,
                                	buttons: {
                                    	Cancel: function() {
                                        	$( this ).dialog( "close" );
                                        	Recaptcha.reload();
                                    	}
                                	},
                                	close: function() {

	 									mapa_cerrar.removeClass('cerrar_activado')
                                	}
                            	});

							mapa_cerrar.addClass('cerrar_activado')

//	ejemplo con jquery.ui.map
//                            var yourStartLatLng = new google.maps.LatLng(39.456326, -0.389961);
//                            $('#map_canvas').gmap({'center': yourStartLatLng});


// Directamente con GoogleMaps
 								var latlng = new google.maps.LatLng(39.456326, -0.389961);
								var myOptions = {
										zoom: 16,
										center: latlng,
										mapTypeId: google.maps.MapTypeId.ROADMAP
									};
								var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

                            $link.click(function() {
                                $dialog_mapa.dialog('moveToTop');
                            });
                        }); // fin del Click

                    } // Fin if del "mapa"
                });

//                $( "#cargando" ).dialog({autoOpen: false,modal: true});

                $( "#aviso-correcto" ).dialog({
					autoOpen: false,
					modal: true,
					buttons: {
						Ok: function() {
						$( this ).dialog( "close" );
				}
			}
		});

                $( "#error" ).dialog({
					autoOpen: false,
					modal: true,
					buttons: {
						Ok: function() {
						$( this ).dialog( "close" );
				}
			}
		});

            });
        </script>


        <div id="dialog-form" title="Quiero saber más" style="display: none;">
            <p class="validateTips">Todos los campos son obligatorios.</p>

            <form>
                <fieldset>
                    <label for="email">Email</label>
                    <input type="text" name="email" id="email" value class="text ui-widget-content ui-corner-all" />
                    <label for="cod_postal">Código Postal</label>
                    <input type="text" name="cod_postal" id="cod_postal" value class="text ui-widget-content ui-corner-all" />
                    <label for="password1">Contraseña</label>
                    <input type="password" name="password1" id="password1" value class="text ui-widget-content ui-corner-all" />
                    <label for="password2">Repita la contraseña</label>
                    <input type="password" name="password2" id="password2" value class="text ui-widget-content ui-corner-all" />
                    <?php
                        //escribimos en la página lo que nos devuelve recaptcha_get_html()
                        echo recaptcha_get_html($captcha_publickey, $error_captcha);
                    ?>
                </fieldset>
                <br>
            </form>
        </div>

        <div id="login" title="Quiero saber más" style="display: none;">
            <p class="validateTips">Todos los campos son obligatorios.</p>
            <form>
                <fieldset>
                    <label for="email">Email</label>
                    <input type="text" name="email" id="email" value class="text ui-widget-content ui-corner-all" />
                    <label for="password">Contraseña</label>
                    <input type="text" name="password" id="password" value class="text ui-widget-content ui-corner-all" />
                    <label for="recordar">Recordar</label>
                    <input type="checkbox" name="recordar" id="recordar" value="1" />

                </fieldset>
            </form>
        </div>
        
        <div id="mapa_google" title="Mapa de Google" style="display: none;">
            <div id="map_canvas" style="width:100%; height:100%"></div>
        </div>
        
        <div id="cargando" title="En Proceso" style="display: none;">
            <p>Realizando el registro.</p>
        </div>

        <div id="aviso-correcto" title="Preregistro realizado"  style="display: none;">
            <p>
                <span class="ui-icon ui-icon-circle-check" style="float:left; margin:0 7px 50px 0;"></span>
                Se ha enviado un mail a la dirección introducida.
            </p>
            <p>Para completar el preregistro ha de pulsar sobre el enlace <b>ACTIVAR</b> del correo que reciba.</p>
        </div>

        <div id="error" title="Error inesperado" style="display: none;">
            <p>
                <span class="ui-icon ui-icon-circle-check" style="float:left; margin:0 7px 50px 0;"></span>
                Se ha producido un error inesperado en su preregistro.
            </p>
            <p>Intentelo de nuevo. Si el error persiste, pongase en contacto con nosotros en la siguiente dirección:</p>
            <p><b>preresgisro-soporte@ebarrio.es</b></p>
        </div>

    </body>
</html>
